<%@ page import="com.depo.quiggle.view.controller.BillingReceivableAction" %>
<%@ page import="com.depo.quiggle.view.controller.ReceivableInvoiceAction" %>
<%--
  Created by IntelliJ IDEA.
  User: ravi
  Date: 7/18/12
  Time: 6:54 PM
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/include/taglibs.jsp"%>
<%--@elvariable id="actionBean" type="com.depo.quiggle.view.controller.BillingReceivableAction"--%>

<script>
$(document).ready(function() {
	$('#receivable').dataTable({
		"aaSorting": [[ 1, "desc" ]],
		"iDisplayLength": 15,
		"aLengthMenu": [[15, 30, 90, -1], [15, 30, 90, "All"]],
		//"bFilter": false,"bInfo": false
		  "aoColumns": [
      {"sType":"numeric"},
      null,
      null,
      null,
      null, 
	  null,
	  null,
	  { "bSearchable": false }
    ] 
		});
	});
</script>
<div class="infoBut"><a href="#" id="infoButton"><img id="helpIMG" src="images/infoicon.png"  alt="Information" border="0" /></a></div>
<div class="instructions" style="width:93%;margin:auto auto 10px;">
            <h3><span class="fright" id="instrutionsSpan">
					<a href="javascript:{}" title="click here to hide the instructions" id="instructionsHideLink" style="background:#E3F2FF;">
						<img  id="instructionsDownarrowimg" src="images/uparrow.png" width="10" height="9" alt="Hide" />
					</a>
				</span>BILLING
& INVOICING
</h3>
            	<div id="contentIns"><strong>Keeping track of billing, invoices and payments has never been easier!</strong>
<ul>
<li>Generate QGL-calculated invoices based on rates applied to the job for A/R</li>
<li>Edit QGL, as needed, to ensure correct billing</li>
<li>Email invoices </li>
<li>Apply Payments</li>
</ul>
</div>
            
</div>

<div class="receivable-table table">
<fmt:setBundle basename="help" var="help" />
    <!--<div class="tr t-header">
        <div class="td i-num">INV#</div>
        <div class="td i-date">INV DATE</div>
        <div class="td j-date">JOB DATE</div>
        <div class="td j-num">JOB#</div>
        <div class="td i-ar">A/R</div>
        <div class="td j-orig">ORIG</div>
        
        <div class="td i-status">STATUS</div>
        <div class="td i-act">ACTIONS</div>
    </div>
    <c:if test="${!empty actionBean.invoices}">
        <c:forEach items="${actionBean.invoices}" var="inv">
        
             <c:set var="invcId" value="${fn:split(inv.invoiceName, '-')}" />
        
            <div class="tr">
            
                <div class="td i-num">${invcId[1]}</div>
               <div class="td i-date"><fmt:formatDate value="${inv.generatedDate}" type="date"/></div>
               <!-- <div class="td i-date"> <!-- <div class="td i-date">${inv.generatedDate}</div>-->
                <!-- <div class="td j-date">${inv.job.jobDate} </div>
                <div class="td j-date"><fmt:formatDate value="${inv.job.jobDate}" type="date"/></div>
                
                <div class="td j-num">${inv.jobReference}</div>
                <div class="td i-ar">${inv.initials}</div>
                <div class="td j-orig">${inv.actualPages}</div>
			 <div class="td i-status">
			<c:choose>
         <c:when test="${inv.status == 'Voided' || inv.status == 'Posted' || inv.status == 'Fully Paid'}">
		  <c:if test="${inv.status == 'Voided'}">
        <span title="<fmt:message bundle='${help}' key='help.billing.VOIDED'/>">  ${inv.status}</span></c:if>
		 <c:if test="${inv.status == 'Posted'}">
		<span title="<fmt:message bundle='${help}' key='help.billing.POSTED'/>">  ${inv.status}</span></c:if>
		 <c:if test="${inv.status == 'Fully Paid'}">
		<span title="<fmt:message bundle='${help}' key='help.billing.PAID_IN_FULL'/>">${inv.status}</span></c:if>
		</c:when>
		<c:otherwise>
           ${inv.status}       
         </c:otherwise>
		</c:choose>
		</div>

		
        

		
                <div class="td i-act">
                    <c:choose>
                        <c:when test="${inv.statusId == 0 || inv.statusId == 1}">                            <stripes:link href="<%=ReceivableInvoiceAction.URL%>" event="generate" >
                            
                                <stripes:param name="jobId" value="${inv.jobId}"/>
                                 <stripes:param name="invoiceId" value="${inv.invoiceId}"/>
                                  <c:if test="${inv.statusId == 0}">
                               <span title="<fmt:message bundle='${help}' key='help.billing.GENERATE'/>"> Generate</span>
                                </c:if>
                                <c:if test="${inv.statusId == 1}">
                               <span title="<fmt:message bundle='${help}' key='help.billing.VIEW'/>"> View</span>
                                </c:if>
                                
                            </stripes:link>
                        </c:when>
                        <c:otherwise>
                            <stripes:link href="<%=ReceivableInvoiceAction.URL%>" event="viewAgentInvoice">
                                <stripes:param name="invoiceId" value="${inv.invoiceId}"/>
                                <stripes:param name="jobId" value="${inv.jobId}"/>
                                <span title="<fmt:message bundle='${help}' key='help.billing.VIEW'/>"> View</span>
                            </stripes:link>
                        </c:otherwise>
                    </c:choose>
                </div>
            </div>
        </c:forEach>
    </c:if>-->
</div>
 <!--<div style="overflow:hidden" id="helpContainer">
  <div id="helpContent" class="helpContentContainer">
    <div style="text-align:right;padding:0px;margin:0px;margin-top:-5px;"><img src="${pageContext.request.contextPath}/images/billing/delete-icon.gif" width="16" height="16" alt="Close" id="close"/></div>
    <p>This is Contextual Help Section for DepoSolutions</p>
  </div>
  <div style="float:right;color:#FFF;"><a href="#" id="slidebutton"><img src="${pageContext.request.contextPath}/images/billing/helpicon.png"  alt="Help" width="36" height="94" border="0" /></a></div>
</div>--> 
<div style="margin-right:20px;">
<table id="receivable" cellpadding="0" cellspacing="0" border="0" width="100%">
 <thead>
<tr>
<th>INV#</th>
<th>INV DATE</th>
<th>JOB DATE</th>
<th>JOB#</th>
<th>A/R</th>
<th>ORIG</th>
<th>STATUS</th>
<th>ACTIONS</th>
</tr>
</thead>
<tbody>

 <c:if test="${!empty actionBean.invoices}">
 
        <c:forEach items="${actionBean.invoices}" var="inv">
        
             <c:set var="invcId" value="${fn:split(inv.invoiceName, '-')}" />
      
		<tr>
			<td>${invcId[1]}</td>
			<td><fmt:formatDate value="${inv.generatedDate}" type="date"/></td>
			<td><fmt:formatDate value="${inv.job.jobDate}" type="date"/></td>
			<td>${inv.jobReference}</td>
			<td>${inv.initials}</td>
			<td>${inv.actualPages}</td>
			<td>
			  <c:if test="${inv.containReqFields}">
				<c:choose>
				
				<c:when test="${inv.status == 'Voided' || inv.status == 'Posted' || inv.status == 'Fully Paid'}">
				<c:if test="${inv.status == 'Voided'}">
					<span title="<fmt:message bundle='${help}' key='help.billing.VOIDED'/>">  ${inv.status}</span></c:if>
				<c:if test="${inv.status == 'Posted'}">
					<span title="<fmt:message bundle='${help}' key='help.billing.POSTED'/>">  ${inv.status}</span></c:if>
				<c:if test="${inv.status == 'Fully Paid'}">
					<span title="<fmt:message bundle='${help}' key='help.billing.PAID_IN_FULL'/>">${inv.status}</span></c:if>
				</c:when>
				
				<c:otherwise>
				   ${inv.status}       
				</c:otherwise>
				</c:choose>
			  </c:if>
			  <c:if test="${!inv.containReqFields}">
			    To Be Generated
			  </c:if>
			</td>
			
			<td>
				<c:if test="${inv.containReqFields}">
				
				<c:choose>
                <c:when test="${inv.statusId == 0 || inv.statusId == 1}">					
				
				<stripes:link href="<%=ReceivableInvoiceAction.URL%>" event="generate" >
					<stripes:param name="jobId" value="${inv.jobId}"/>
					<stripes:param name="invoiceId" value="${inv.invoiceId}"/>
                
					<c:if test="${inv.statusId == 0}">
						<span title="<fmt:message bundle='${help}' key='help.billing.GENERATE'/>"> Generate</span>
					</c:if>
                
					<c:if test="${inv.statusId == 1}">
						<span title="<fmt:message bundle='${help}' key='help.billing.VIEW'/>"> View</span>
					</c:if>
				</stripes:link>
                </c:when>
                        
				<c:otherwise>
					<stripes:link href="<%=ReceivableInvoiceAction.URL%>" event="viewAgentInvoice">
						<stripes:param name="invoiceId" value="${inv.invoiceId}"/>
						<stripes:param name="jobId" value="${inv.jobId}"/>
						<span title="<fmt:message bundle='${help}' key='help.billing.VIEW'/>"> View</span>
                    </stripes:link>
                </c:otherwise>
                </c:choose>
				
				</c:if>
				
				<c:if test="${!inv.containReqFields}">
					<stripes:link href="job-detail-accounting-edit.action">
					<stripes:param name="jobId" value="${inv.jobId}"/>
					<stripes:param name="pendingTurnInEdit" value="true"/>
					<span title="Required Fields are missing to Generate Invoice for this Job"> Edit Job</span>
					</stripes:link>
				</c:if>
		  </td>
		</tr>
		
		       
        </c:forEach>
 </c:if>
 </tbody>
<tfoot>
<tr>
	<th>INV#</th>
	<th>INV DATE</th>
	<th>JOB DATE</th>
	<th>JOB#</th>
	<th>A/R</th>
	<th>ORIG</th>
	<th>STATUS</th>
	<th>ACTIONS</th>
</tr>
</tfoot>

</table>
</div>
<!-- Begin InformationText -->
<div style="overflow:hidden;height:78%;display: none;" id="infoContainer">
  <div id="infoContent" class="infoContentContainer">
    <div style="text-align:right;padding:0px;margin:0px;margin-top:-5px;"><img src="images/delete-icon.gif" width="16" height="16" alt="Close" id="infoclose" style="cursor:pointer;"/></div>
    
    	  <div class="insContent" style="height: 420px;">
  <p>Choose <strong>Receivable </strong>or <strong>Payable</strong> to start billing and generate the invoice.<br />
    <br />
You can <strong>sort</strong> columns by clicking on the column  header or label.  <br />
<br />
<strong>Search </strong>for specific billing fields.<br />
<br />
<strong>BILLING ACTIONS</strong></p>
  <ol>
    <li><strong>Edit Job </strong>– Information is incomplete in  QGL and invoice cannot be generated.   Return to QGL and ensure the following:</li>
    <ol>
      <li>Rate  codes have been applied to A/R and A/P, if applicable.</li>
    </ol>
  </ol>
  <p>TIP:  Hover mouse over A/R and A/P for confirmation  of rate codes that have been applied.</p>
  <ol>
    <li><strong>Generate </strong>– Clicking generates an invoice  and takes you to the invoice form.  The  information is complete in QGL and the invoice is ready to be generated (actual  field and turn-in date must have data entered and saved).</li>
    <li><strong>View – </strong>You can view only the QGL related  to this profile category (A/R or A/P).</li>
    <li><strong>Void –</strong> This invoice has been voided.</li>
    <li><strong>Posted</strong>- This invoice has been approved  by you and has been finalized and posted.</li>
    <ol>
      <li><strong>TIP:</strong>  If you notice after you post the invoice that  it is incorrect, simply choose <strong>void and  new</strong> – all QGL-calculated information and Rate Table Profile values will  remain and QGL can be edited for accuracy.   A new invoice number will be issued.</li>
    </ol>
  </ol>
  <p>&nbsp;</p>
  <p><strong>STATUS:</strong></p>
  <ol>
    <li><strong>To Be Generated – </strong>Invoice hasn&rsquo;t been created yet;  once generated, an invoice number and date will be automatically entered.</li>
    <li><strong>Generated – </strong>Invoice generated.  Not finalized or approved.  Not Posted.</li>
    <li><strong>Voided –</strong> This invoice has been voided.</li>
    <li><strong>Posted</strong>- This invoice has been approved  by you and has been finalized and posted.</li>
    <ol>
      <li><strong>TIP:</strong>  If you notice after you post the invoice that  it is incorrect, simply choose <strong>void and  new</strong> – all QGL-calculated information and Rate Table Profile values will  remain and QGL can be edited for accuracy.   A new invoice number will be issued.</li>
    </ol>
    <li><strong>Partially Paid – </strong>A payment has been applied.</li>
    <li><strong>Paid in Full –</strong> Invoice has been paid.</li>
  </ol>
  <p>When the invoice is generated, the QGL-generated  invoice is automatically given sequential invoice numbers and the current  date.  TIP:  A/P invoices will have the  initials preceding the invoice number to differentiate between A/R and A/P and  A/P.<br />
    <strong>INVOICE ACCOUNTS</strong></p>
  <ol>
    <li><strong>EDIT </strong>or  click on <strong>Click Here for Details –</strong> this will open up QGL Detail Accounting</li>
    <li><strong>POST  – </strong>finalizes the invoice.  TIP:   ONLY Void or Void and New can be utilized to edit the invoice related to  the job</li>
    <li><strong> Send – </strong>Emails the invoice to the contact  you have entered in the Rate Table Profile (choose one or more than one)</li>
    <li><strong>Void  and New </strong>– Voids the invoice number and reverts invoice back to  just-generated status, allowing QGL fields to be modified or changed.<strong> </strong></li>
    <li><strong>Void  – </strong>Voids the invoice.</li>
    <li><strong>Apply  Payment </strong></li>
    <ol>
      <li>Enter date received</li>
      <li>Choose payment mode</li>
      <li>Enter payment reference (check number or check  date or &ldquo;partial payment&rdquo; or whatever you want)</li>
      <li>Enter amount</li>
    </ol>
    <li><strong>Print  – </strong>If the invoice is not posted, Draft:   &ldquo;This Invoice is Not Posted&rdquo; will appear on the invoice preview.  </li>
  </ol>
  
</div>

</div>
  <div style="float:right;color:#FFF;"><a href="#" id="slidebutton1"><img src="images/infoicon.png"  alt="Information" border="0" /></a></div>
</div>
 <!-- End InformationText -->  

 </div> 
<style>
#sub-tab-parent{border-radius:5px 5px 0px 0px;}
.dashboard-content{display:table;width:100%;padding:5px 0px;border-radius:0px 0px 5px 5px;}
.dataTables_wrapper{width: 98%;  margin: 0 auto;}
</style>